import { Component, OnInit, OnDestroy } from '@angular/core';
import { MapService, StyleService } from '../../../core';
import { ShareMessageService } from '../../../core/services/share-message.service';

@Component({
  selector: 'app-draw-tools',
  templateUrl: './draw-tools.component.html',
  styleUrls: ['./draw-tools.component.scss']
})
export class DrawToolsComponent implements OnInit, OnDestroy {
  // 记录是否绘制
  startDraw = false;
  drawCoorDinates = []; // 记录绘制坐标
  mapboxglmap = null;
  draw = null;
  data = [
    {
      id: 'draw_point',
      title: '绘点',
      dimg: './assets/img/toolbar/btn_sps_point.png',
      simg: './assets/img/toolbar/btn_sps_point_select.png',
      active: false,
    },
    // {
    //   id: 'draw_line_string',
    //   title: '绘线',
    //   dimg: './assets/img/toolbar/maptool_dist.png',
    //   simg: './assets/img/toolbar/maptool_dist_select.png',
    //   active: false,
    // },
    // {
    //   id: 'draw_polygon',
    //   title: '绘面',
    //   dimg: './assets/img/toolbar/btn_sps_plogon.png',
    //   simg: './assets/img/toolbar/btn_sps_plogon_select.png',
    //   active: false,
    // }
  ];
  tmp = 0;
  selectItem = null;
  isopen = false;
  subscriptations = [];
  constructor(
    private mapService: MapService,
    private shareMessageService: ShareMessageService,
  ) { }

  ngOnInit() {
    this.mapService.init().then((mapboxglmap: any) => {
      this.mapboxglmap = mapboxglmap;
      if (mapboxglmap.isStyleLoaded()) {
        this.init();
      } else {
        mapboxglmap.on('load', () => {
          this.init();
        });
      }
    });
    this.subscriptations.push(
      postal.channel('QUESTION_TREE_CHANNEL').subscribe('calcedraw', res => {
        // 清空当前选择项（当前操作：用户绘制并添加完标记后，保存并关闭绘制状态）
        this.isopen = false;
      }));
  }
  init() {
  }
  // 临时替换
  drawPointclick(e) {
    this.isopen = !this.isopen;
    // 我就不破坏原来的结构（传递参数为string类型）了！
    this.shareMessageService.sendMessage(this.isopen + '');
  }
  ngOnDestroy() {
    this.subscriptations.forEach(element => {
      element.unsubscribe();
    });
  }
}
